<template>
	<view class="flex-container">
		<Loading :isLoading="isLoading"></Loading>
		<view>
			<!-- 提示信息弹窗 -->
			<uni-popup ref="message" type="message">
				<uni-popup-message :type="msgType" :message="messageText" :duration="4000"></uni-popup-message>
			</uni-popup>
		</view>
		<view class="flex-item1 ">
			<view class="title flex-twice flex">
				<span class="title-left">设备名称</span>
				<yt-scanCode style="margin-top: 2%;margin-left: 40%;" btnName="扫码"
					@getScanCode="OnScanningCode"></yt-scanCode>
			</view>
			<view class="list">
				<div class="list-a">
					<span class="list-left">设备编码: {{parm.code}}</span>
				</div>
				<div class="list-a">
					<span class="list-type">设备名称: {{parm.name}}</span>
				</div>
				<div class="list-a">
					<span class="list-left">设备状态: {{parm.type}}</span>
				</div>
				<div class="list-a">
					<span class="list-left">设备今日完工挂数: {{parm.thisNum}}</span>
				</div>
				<div class="userlist-a">
					<span class="zlist-left">制程类型:</span>
					<span class="zlist-right">
						<uni-data-select v-show="parm.type!=='加工中'" v-model="parm.value" :localdata="range"
							style="width:65%;" @change="change"></uni-data-select>
						<uni-data-select v-show="parm.type==='加工中'" disabled v-model="parm.value" :localdata="range"
							style="width:65%;" @change="change"></uni-data-select>
					</span>
				</div>
			</view>
			<view class="title" style="border-top: 1px solid #dcdfe6">
				<span class="title-left">用户信息</span>
			</view>
			<view class="userlist">
				<div class="userlist-a">
					<span class="userlist-left">用户编码:</span>
					<span class="userlist-right1">{{loginUser_userCode}}</span>
				</div>
				<div class="userlist-a">
					<span class="userlist-left">用户名称:</span>
					<span class="userlist-right">{{loginUser_name}}</span>
				</div>
				<div class="userlist-a">
					<span class="userlist-left">登录时间:</span>
					<span class="userlist-right">{{loginUser_time}}</span>
				</div>
			</view>
		</view>
		<view class="flex-item2">
			<view class="title flex-twice flex">
				<span class="title-left">加工工单列表</span>
				<uni-easyinput style="height: 30px;margin-top: 2px;line-height: 0rpx;" v-model="headMo" type="number"
					v-show="parm.type==='加工中'" :disabled="true" placeholder="请输入MO号" />
				<uni-easyinput style="height: 30px;margin-top: 2px;line-height: 0rpx;" v-model="headMo" type="number"
					v-show="parm.type!=='加工中'" placeholder="请输入MO号" />
				<button size="mini" type="primary" style="height: 30px;margin-top: 5px;width: 90px;"
					@click="findheadeMo()">查询</button>
			</view>
			<uni-table ref="table" :style="{ height: viewHeight+'px' }" :loading="loading" border stripe
				emptyText="暂无更多数据">
				<uni-tr>
					<uni-th width="50px" align="center">序号</uni-th>
					<uni-th width="70px" align="center">工单号</uni-th>
					<!-- <uni-th width="60px">图号</uni-th>
					<uni-th width="70px" >版本号</uni-th> -->
					<uni-th width="60px" align="center">工序号</uni-th>
					<uni-th width="70px" align="center">工序名称</uni-th>
					<uni-th width="70px" align="center">工序状态</uni-th>
					<uni-th width="70px" align="center">投产数量</uni-th>
					<uni-th width="80px" align="center">已完工数量 </uni-th>
					<uni-th width="100px" align="center">本次上挂数量</uni-th>
					<uni-th width="90px" align="center">操作</uni-th>
				</uni-tr>
				<uni-tr v-for="(item, index) in workList" :key="index">
					<uni-td width="50px" align="center">{{index + 1}}</uni-td>
					<uni-td width="70px" align="center"><span class="num">{{ item.mo }}</span></uni-td>
					<!-- 	<uni-td align="center">{{ item.kzh }}</uni-td> -->
					<!-- <uni-td align="center">{{ item.chitStandardvalue }}</uni-td> -->
					<uni-td width="60px" align="center"><span class="num">{{ item.jobCode }}</span></uni-td>
					<uni-td width="70px" align="center">{{ item.jobName }}</uni-td>
					<uni-td width="70px" align="center">{{ item.stutStatename }}</uni-td>
					<uni-td width="70px" align="center">{{ item.jobPrudctNum }}</uni-td>
					<uni-td width="80px" align="center">{{ item.jobActualAmount }}</uni-td>
					<uni-td width="100px" align="center">
						<uni-easyinput v-show="parm.type==='加工中'" disabled type="number" v-model="item.reportNum"
							style="width: 80px;" placeholder="" @blur="changeValue(item)" @clear="changeValue(item)"
							@keyboardheightchange="changeValue(item)" />
						<uni-easyinput v-show="parm.type!=='加工中'" type="number" v-model="item.reportNum"
							style="width: 80px;" placeholder="" @blur="changeValue(item)" @clear="changeValue(item)"
							@keyboardheightchange="changeValue(item)" />
					</uni-td>
					<uni-td width="90px" align="center"> <button class="uni-button" size="mini" type="warn"
							@click="handleDelete(item)">删除</button></uni-td>
				</uni-tr>
			</uni-table>
		</view>
		<view class="flex-item3">
			<view class="title">
				<span class="title-left">按钮区域</span>
				<view class="buttonlist" style="margin-top: 10px;">
					<scanCode class="button-a" btnName="工单扫码" :parm="parm" @getScanCode="findOneMo"></scanCode>
					<button class="button-a" @click="onNum()">上挂数量填充</button>
					<button class="button-a" @click="receiveWork()">现场接收</button>
					<button class="button-a" @click="startWork()">手动开工</button>
					<button class="button-a" @click="saveEndWork()">手动完工</button>
					<button class="button-a" @click="transfer()">转移下序</button>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		TProcessList,
		btnSelectLeftListByMo,
		getJobByJobId,
		EquiMachineToolList,
		getBcWorkCenterByPartyId,
		receiveWork,
		preEndWork,
		startWork,
		endWork,
		transfer,
		renovate
	} from '@/api/system/batch.js'
	import Loading from '@/components/Loading.vue';
	export default {
		components: {
			Loading
		},
		data() {
			return {
				isLoading: false,
				searchValue: "",
				headMo: "",
				loginUser_userCode: this.$store.state.user.userCode, //登录用户
				loginUser_name: this.$store.state.user.name, //登录用户
				loginUser_time: this.$store.state.user.time, //登录用户
				range: [],
				loading: false,
				viewHeight: uni.getSystemInfoSync().windowHeight - 70, // 更新视口高度
				workList: [],
				parm: {
					code: "",
					name: "",
					type: "",
					thisNum: "",
					value: "",
					loginUserName: this.$store.state.user.name, //登录用户
					loginUserCode: this.$store.state.user.userCode, //登录用户
				},
				bcWorkCenterList: [], //加工中心
				loginUser: {},
				scanUsers: [],
				type: 'center',
				msgType: '',
				messageText: '',
				logId: '', //设备绑定工单
			}
		},
		created() {
			this.loginUser = this.$store.state.user.userAll;
			// console.log("1", this.$store.state.user.userAll)
			this.onTProcess();
			this.getBcWorkCenter();
		},
		methods: {
			onTProcess() {
				this.range = [];
				TProcessList().then(res => {
					for (var i = 0; i < res.length; i++) {
						this.range.push({
							value: res[i].id,
							text: res[i].type
						})
					}
					console.log(this.range)
				});

			},
			getBcWorkCenter() {
				let data = {}
				data.loginUser = this.loginUser
				data.scanUserList = this.scanUsers
				getBcWorkCenterByPartyId(data).then(res => {
					this.bcWorkCenterList = res;
					// console.log(this.bcWorkCenterList);
				});
			},
			OnScanningCode(res) {
				this.EquiMachineTool(res);
			},
			async EquiMachineTool(res) {
				// console.log("1")
				let result = await EquiMachineToolList(res, this.$store.state.user.userCode);
				console.log("1", result)
				if (result.eq.length > 0) {
					this.logId = "";
					this.workList = [];
					this.parm.name = result.eq[0].MATONAME;
					this.parm.code = result.eq[0].MATOCODE;
					this.parm.type = result.eq[0].TYPE;
					this.parm.thisNum = result.eq[0].THISNUM;
					//console.log("1", result)
					for (var i = 0; i < result.mo.length; i++) {
						await this.findMo(result.mo[i].MO);
						this.logId = result.mo[i].PID + ""
						this.parm.value = result.mo[i].TPROCESSTYPEID + ""
						var table = JSON.parse(JSON.stringify(this.workList));
						for (var j = 0; j < table.length; j++) {
							if (table[j].jobId === result.mo[i].JOB_ID) {
								//console.log(result.mo[i].REPORTNUM)
								table[j].reportNum = result.mo[i].REPORTNUM === undefined ? "" : Number(result.mo[i]
									.REPORTNUM);
							}
						}
						// console.log(table)
						this.workList = table;
						// console.log(this.workList)
					}

				} else {
					this.prompt(`查询不到设备信息!`, 'error')
				}
			},
			async findMo(res) {
				let result = await btnSelectLeftListByMo(res)
				//console.log(result)
				let moLast = result
				if (moLast !== '') {
					this.workListPushJob(moLast)
					this.checkedProcsChange(moLast)
				}
			},
			async findOneMo(res) {
				let result = await btnSelectLeftListByMo(res)
				//console.log(result)
				let moLast = result
				if (moLast !== '') {
					this.workListPushJob(moLast)
					this.checkedProcsChange(moLast)
				} else {
					this.prompt(`工单不存在!`, 'error')
				}
			},
			async findheadeMo() {
				if (this.parm.code != "" && this.parm.value != "" && this.parm.type !== "加工中") {
					let result = await btnSelectLeftListByMo(this.headMo)
					//console.log(result)
					let moLast = result
					if (moLast !== '') {
						this.workListPushJob(moLast)
						this.checkedProcsChange(moLast)
					} else {
						this.prompt(`工单不存在!`, 'error')
					}
				} else if (this.parm.type === "加工中") {
					this.prompt(`设备加工中不能中途添加工单！`, 'error')
				} else {
					if (this.parm.code === "" && this.parm.value === "") {
						this.prompt(`设备和制程类型,不能为空！`, 'error')
					} else
					if (this.parm.code === "") {
						this.prompt(`设备不能为空！`, 'error')
					} else
					if (this.parm.value === "") {
						this.prompt(`制程类型不能为空！`, 'error')
					}
				}

			},
			//工单去重
			async workListPushJob(pushJob) {
				let b = this.workList.some(job => job.jobId === pushJob.jobId)
				if (!b) {
					this.workList.push(pushJob)
				}
				var table = JSON.parse(JSON.stringify(this.workList));
				for (var i = 0; i < table.length; i++) {
					table[i].reportNum = "";
				}
				if (this.parm.type !== "加工中") {
					this.workList = table;
				}
			},
			//先查询下工单工序最新状态
			async checkedProcsChange(mo) {
				let result = await getJobByJobId(mo.jobId)
				const moLast = result.data
				//console.log("最新状态", moLast);
				this.workListPushJob(moLast)
			},
			change(e) {
				this.parm.value = e;
			},
			/**
			 *本次上挂数
			 */
			changeValue(item) {
				for (var i = 0; i < this.workList.length; i++) {
					if (this.workList[i].jobId === item.jobId) {
						if (item.reportNum > (this.workList[i].jobPrudctNum - this.workList[i].jobActualAmount)) {
							this.prompt(this.workList[i].mo + `上挂数量超出最大值`, 'error')
							this.workList[i].reportNum = ""
						} else {
							this.workList[i].reportNum = item.reportNum
						}
					}
				}
				console.log("changeValue", this.workList)
			},
			/** 删除按钮操作 */
			handleDelete(row) {
				if (this.parm.type === "加工中") {
					this.prompt(`设备加工中不能删除！`, 'error')
				} else {
					this.workList.splice(row, 1)
				}
			},
			onNum() {
				if (this.parm.type === "加工中") {
					this.prompt(`设备加工中不能数量填充！`, 'error')
				} else {
					var table = JSON.parse(JSON.stringify(this.workList));
					for (var i = 0; i < table.length; i++) {
						table[i].reportNum = table[i].jobPrudctNum - table[i].jobActualAmount;
					}
					this.workList = table;
				}
			},
			unReceiveWorkList() {
				return this.workList.filter(job => job.stutStatecode !== 'PLAN.t_plan_Job.STUT_StateCode.014' && job
					.stutStatecode !== 'PLAN.t_plan_Job.STUT_StateCode.018')
			},
			needWorkList() {
				return this.workList.filter(job => job.stutStatecode !== 'PLAN.t_plan_Job.STUT_StateCode.018')
			},
			needStartWorkList() {
				return this.workList.filter(job => {
					if (job.stutStatecode === 'PLAN.t_plan_Job.STUT_StateCode.018' || job.jobPrudctNum === job
						.jobActualAmount) {
						//判断如果已加工 = 投产数 也不可以开工
						return false
					} else {
						return true
					}
				})
			},
			bcWorkCenterUser() {
				for (let i = 0; i < this.workList.length; i++) {
					if (!this.bcWorkCenterList.includes(this.workList[i].jobResouercode)) {
						var messageText = `当前登录人没有本工序:` + this.workList[i].jobResourname + `-` + this.workList[i]
							.jobResouercode + ` 的生产单元权限，不能现场接收!`;
						this.prompt(messageText, 'error')
						return 1;
					}
				}
				return 0;
			},
			//刷新
			async refreshWorkList() {
				//刷新
				var table = JSON.parse(JSON.stringify(this.workList));
				let dataAfter = {}
				dataAfter.reportJobDtos = this.workList
				let resultAfter = await preEndWork(dataAfter)
				this.workList = resultAfter.data
				for (var i = 0; i < this.workList.length; i++) {
					for (var j = 0; j < table.length; j++) {
						if (table[j].jobId === this.workList[i].jobId) {
							console.log("刷新数据", 1)
							this.workList[i].reportNum = table[j].reportNum;
						}
					}
				}
				this.workList = JSON.parse(JSON.stringify(this.workList));
				console.log("刷新数据", this.workList)
			},
			//提示
			prompt(messageText, msgType) {
				this.messageText = messageText;
				this.msgType = msgType;
				this.$refs.message.open();
			},
			showLoading() {
				this.isLoading = true;
			},
			hideLoading() {
				this.isLoading = false;
			},
			// 接收
			async receiveWork() {
				if (this.parm.type === "加工中") {
					this.prompt(`设备加工中不能接收！`, 'error')
					return
				}
				//表处工作台增加人员-生产单元权限控制
				if (this.bcWorkCenterUser() > 0) {
					return
				}

				if (this.workList.length === 0) {
					this.prompt(`没有工单`, 'error')
					return
				}
				// console.log("unReceiveWorkList", this.unReceiveWorkList())
				if (this.unReceiveWorkList().length === 0) {
					this.prompt(`没有需要现场接收的工单!`, 'error')
					return
				}
				this.showLoading();
				let data = {}
				data.reportJobDtos = this.unReceiveWorkList();
				data.loginUser = this.loginUser;
				data.scanUserList = this.scanUsers;
				console.log('接收', data)
				let result = await receiveWork(data);
				if (result.data === '接收成功') {
					this.prompt(`接收成功!`, 'success')
				} else {
					this.prompt(result.data, 'error')
				}
				await this.refreshWorkList();
				this.hideLoading();
			},
			//开工
			async startWork() {
				//表处工作台增加人员-生产单元权限控制
				if (this.bcWorkCenterUser() > 0) {
					return
				}
				//判断如果有状态未接收需要提示
				if (this.unReceiveWorkList().length > 0) {
					this.prompt(`有需要现场接收的工单，请先现场接收!`, 'error')
					return
				}
				if (this.workList.length === 0) {
					this.prompt(`没有工单!`, 'error')
					return
				}
				let data = {}
				console.log(this.needWorkList())
				data.reportJobDtos = this.workList.filter(job => job.reportNum !== undefined && job.reportNum !==
					'')
				if (data.reportJobDtos.length !== this.workList.length) {
					this.prompt(`请填写报工数量!`, 'error')
					return
				}
				//校验报工数量合法性
				let flag = data.reportJobDtos.some(job => {
					if (!/^-?\d+(.\d+)?$/.test(job.reportNum)) {
						console.log(job.reportNum)
						return true
					}
				})
				if (flag) {
					this.prompt(`报工数量必须为数值!`, 'error')
					return
				}
				if (this.needStartWorkList().length > 0) {
					this.showLoading();
					let data = {}
					data.reportJobDtos = this.needStartWorkList()
					data.loginUser = this.loginUser
					data.scanUserList = this.scanUsers
					let result = await startWork(data)
					if (result.data === '开工成功') {
						if (this.parm.type !== "加工中") {
							await this.renovate('开工成功')
						} else {
							this.prompt("开工成功", 'success')
						}
					} else {
						this.prompt(result.data, 'error')
					}
				} else {
					this.prompt("工单无需开工,请直接报工！", 'warning')
				}
				//重新查询已开工的工作台
				await this.refreshWorkList()
				this.hideLoading();
			},
			//报工
			async saveEndWork() {
				//表处工作台增加人员-生产单元权限控制
				if (this.bcWorkCenterUser() > 0) {
					return
				}
				//判断如果有状态未接收需要提示
				if (this.unReceiveWorkList().length > 0) {
					this.prompt(`有需要现场接收的工单，请先现场接收!`, 'error')
					return
				}
				if (this.workList.length === 0) {
					this.prompt(`没有工单!`, 'error')
					return
				}
				let data = {}
				console.log(this.needWorkList())
				data.reportJobDtos = this.needWorkList().filter(job => job.reportNum !== undefined && job.reportNum !==
					'')
				if (data.reportJobDtos.length === 0) {
					this.prompt(`请填写报工数量!`, 'error')
					return
				}
				//校验报工数量合法性
				let flag = data.reportJobDtos.some(job => {
					if (!/^-?\d+(.\d+)?$/.test(job.reportNum)) {
						console.log(job.reportNum)
						return true
					}
				})
				if (flag) {
					this.prompt(`报工数量必须为数值!`, 'error')
					return
				}
				this.showLoading();
				data.loginUser = this.loginUser
				data.scanUserList = this.scanUsers
				data.reportUser = this.loginUser
				// if (this.showScanUser) {
				// 	//获取刷卡用户 作为报工用户
				// 	let scanUser = this.scanUsers[0]
				// 	let reportUser = {}
				// 	reportUser.userId = scanUser.partyId
				// 	reportUser.userName = scanUser.partyName
				// 	reportUser.userCode = scanUser.partyCode
				// 	data.reportUser = reportUser
				// } else {
				// 	//获取登录用户 作为报工用户
				// 	data.reportUser = this.loginUser
				// }
				let result = await endWork(data)
				if (result.data === '报工成功') {
					this.prompt('报工成功', 'success')
				} else {
					this.prompt(result.data, 'error')
				}
				await this.refreshWorkList()
				this.hideLoading();
			},
			//转移下序
			async transfer() {
				// if (this.parm.type === "加工中") {
				// 	this.prompt(`设备加工中不能转移下序！`, 'error')
				// 	return
				// }
				//20240318 ly 表处工作台增加人员-生产单元权限控制
				for (let i = 0; i < this.workList.length; i++) {
					if (!this.bcWorkCenterList.includes(this.workList[i].jobResouercode)) {
						var a = (`当前登录人没有本工序:` + this.workList[i].jobResourname + `-` + this.workList[i]
							.jobResouercode + ` 的生产单元权限，不能转移下序!`)
						this.prompt(a, 'error')
						return
					}
					if (this.workList[i].jobName.includes('表处检验') || this.workList[i].jobName.includes('机加工车间检验组')) {
						this.prompt("机加，表处检验序不可在工作台转序", 'error')
						return
					}
				}
				//判断如果有状态未接收需要提示
				if (this.unReceiveWorkList().length > 0) {
					this.prompt(`有需要现场接收的工单，请先现场接收!`, 'error')
					return
				}
				if (this.workList.length === 0) {
					this.prompt(`没有工单!`, 'error')
					return
				}
				this.showLoading();
				let data = {}
				data.reportJobDtos = this.needWorkList()
				data.loginUser = this.loginUser
				data.scanUserList = this.scanUsers
				let result = await transfer(data)
				if (result.data === '转移成功') {
					await this.renovate('转移成功')
					this.workList = []
					this.parm.value = "";
				} else {
					await this.renovate('')
					this.prompt(result.data, 'error')
				}
				// if (result.data === '转移成功') {
				// 	this.prompt(`转移成功!`, 'success')
				// 	this.workList = []
				// 	this.parm.value = "";
				// } else {
				// 	this.prompt(result.data, 'error')
				// }
				//重新查询已开工的工作台
				await this.refreshWorkList()
				this.hideLoading();
			},
			async renovate(name) {
				console.log(name, this.logId)
				if (name === "开工成功" && this.logId === "") {
					let data = {}
					data.bcPlanJobVo = this.workList
					data.parm = this.parm
					data.logId = this.logId
					this.hideLoading();
					let result = await renovate(data)
					//console.log(result)
					this.prompt(name, 'success')
					this.logId = result.data.logId + "";
					this.EquiMachineTool(this.parm.code);
					//console.log(this.logId)
				} else if (name == "转移成功" && this.logId !== "") {
					let data = {}
					data.bcPlanJobVo = this.workList
					data.parm = this.parm
					data.logId = this.logId
					this.hideLoading();
					let result = await renovate(data)
					console.log(result)
					this.prompt(name, 'success')
					this.logId = "";
					this.EquiMachineTool(this.parm.code);
				} else if (name == "" && this.logId !== "") {
					let data = {}
					data.bcPlanJobVo = this.workList
					data.parm = this.parm
					data.logId = this.logId
					this.hideLoading();
					let result = await renovate(data)
					this.logId = "";
					this.EquiMachineTool(this.parm.code);
				} else if (name !== "") {
					this.prompt(name, 'success')
				}

			}
		}
	}
</script>

<style>
	.num {

		text-align: center;
		vertical-align: middle;
		word-wrap: break-word;
		word-break: break-all;
	}

	.container {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		height: 100vh;
	}

	.title-left {
		margin-left: 20rpx;
	}

	.title {
		background-color: #ffffff;
		height: 86.6rpx;
		line-height: 86.6rpx;
		text-align: left;
		font-size: 36rpx;
		color: #111;
		border-bottom: 1px solid #dcdfe6;
	}

	.flex-container {
		display: flex;
		justify-content: space-between;
	}

	.flex-item1 {
		width: 24%;
		height: 98vh;
		margin: 0.5%;
		background-color: #ffffff;
		border: 1px solid #dcdfe6;
	}

	.flex-item2 {
		background-color: #ffffff;
		height: 98vh;
		width: 60%;
		margin-top: 0.5%;
		border: 1px solid #dcdfe6;
	}

	.flex-item3 {
		background-color: #ffffff;
		height: 98vh;
		width: 14%;
		margin: 0.5%;
		border: 1px solid #dcdfe6;
	}

	.list-a {
		font-size: 15px;
		margin-top: 20px;
		margin-left: 10%;
	}

	.list-type {
		float: left;
		width: 100%;
		height: 35px;
	}

	.list {
		margin-bottom: 10rpx;
		height: 35vh;
		padding: 10rpx;
		font-size: 14rpx;
		//font-weight: 700;
		color: #111;
		border: 1px solid #dcdfe6;
		width: 95%;
		margin-top: 25rpx;
		margin-left: 2.5%;
		-webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .1), 0 0 6px 0 rgba(0, 0, 0, .04);
		box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .1), 0 0 6px 0 rgba(0, 0, 0, .04);
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
	}

	.list-left {
		float: left;
		width: 100%;
		height: 30px;
	}

	.userlist {
		margin-bottom: 10rpx;
		height: 87.5px;
		padding: 10rpx;
		font-size: 14rpx;
		//font-weight: 700;
		color: #111;
		border: 1px solid #dcdfe6;
		width: 95%;
		margin-top: 25rpx;
		margin-left: 2.5%;
		-webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .1), 0 0 6px 0 rgba(0, 0, 0, .04);
		box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .1), 0 0 6px 0 rgba(0, 0, 0, .04);
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
	}

	.buttonlist {
		margin-top: 10rpx;
	}

	.button-a {
		margin: 6px;
		margin-top: 25px;
		background-color: #007aff;
		width: 90%;
		margin-left: 5%;
		color: #fff;
	}

	.userlist-a {
		line-height: 40rpx;
		font-size: 30rpx;
		margin-top: 10rpx;
		margin-left: 10%;
	}

	.userlist-left {
		float: left;
		width: 43%;
		height: 22px;
	}

	.userlist-right {
		float: right;
		width: 57%;
		height: 22px;
	}

	.zlist-left {
		float: left;
		width: 70px;
		height: 22px;
		margin-top: 6px;
	}
</style>